<template>
	<view class="ucenter-page">
		<u-navbar title-size="36"  height="42" :border-bottom="false" title="我的积分"></u-navbar>
		<view class="content">
			<view class="u-cells">
				<view class="u-cell">
					<view class="u-cell-left flex_bd">
						<view class="u-cell-title">每日签到</view>
						<view class="u-cell-desc ellipsis">每次<text class="number">+5</text>，每周连续签到3天<text class="number">+10</text>，满勤<text class="number">+20</text></view>
					</view>
					<view class="u-cell-right">
						<button type="default" class="btn" @click="sign = false" v-if="sign">签到</button>
						<button type="default" class="btn disabled-btn" v-else>已签到</button>
						<view class="fraction">3/7</view>
					</view>
				</view>
				<view class="u-cell">
					<view class="u-cell-left flex_bd">
						<view class="u-cell-title">首次完善个人资料</view>
						<view class="u-cell-desc ellipsis">首次完善个人资料，一次性奖励<text class="number">+20</text></view>
					</view>
					<view class="u-cell-right">
						<button type="default" class="btn" @click="perfect = false" v-if="perfect">完善</button>
						<button type="default" class="btn disabled-btn"  v-else>已完善</button>
					</view>
				</view>
				<view class="u-cell">
					<view class="u-cell-left flex_bd">
						<view class="u-cell-title">邀请好友注册</view>
						<view class="u-cell-desc ellipsis">邀请好友注册完成，奖励<text class="number">+20</text></view>
					</view>
					<view class="u-cell-right">
						<button type="default" class="btn" @click="invite = false" v-if="invite">邀请</button>
						<button type="default" class="btn disabled-btn" v-else>已邀请</button>
						<view class="fraction">1/5</view>
					</view>
				</view>
				<view class="u-cell">
					<view class="u-cell-left flex_bd">
						<view class="u-cell-title">有效推荐线索</view>
						<view class="u-cell-desc ellipsis">提交线上并确认有效<text class="number">+20</text></view>
					</view>
					<view class="u-cell-right">
						<view class="fraction">1/5</view>
					</view>
				</view>
				<view class="u-cell">
					<view class="u-cell-left flex_bd">
						<view class="u-cell-title">分享设备</view>
						<view class="u-cell-desc ellipsis">分享设备给好友<text class="number">+5</text></view>
					</view>
					<view class="u-cell-right">
					</view>
				</view>
				<view class="u-cell">
					<view class="u-cell-left flex_bd">
						<view class="u-cell-title">好友询价</view>
						<view class="u-cell-desc ellipsis">好友通过分享设备询价<text class="number">+20</text></view>
					</view>
					<view class="u-cell-right">
					</view>
				</view>
				<view class="u-cell">
					<view class="u-cell-left flex_bd">
						<view class="u-cell-title">推荐成交</view>
						<view class="u-cell-desc ellipsis">推荐设备给好友最终实现成交<text class="number">+30</text></view>
					</view>
					<view class="u-cell-right">
					</view>
				</view>
				<view class="u-cell">
					<view class="u-cell-left flex_bd">
						<view class="u-cell-title">全部完成</view>
						<view class="u-cell-desc ellipsis">完成全部任务<text class="number">+50</text></view>
					</view>
					<view class="u-cell-right">
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				list: [{
					title: '线索 UB20091910',
					price: 2000,
					tags: ['ZE205E-10','6台','分佣比例10%'],
					time: '2021-05-19',
					state:'待处理'
					
				}, {
					title: '线索 UB20091019',
					price: 2000,
					tags: ['ZE205E-10','6台','分佣比例10%'],
					time: '2021-05-19',
					state:''
				}],
				sign:true,
				perfect:true,
				invite:true
			}
		},
		onLoad() {

		},
		methods: {
			openUrl(e) {
				console.log(e)
				uni.navigateTo({
					url: e
				});
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F5F5F5;
	}

	.content {
		padding:32rpx;
	}

	.u-cell {
		background-color: #fff;
		border-radius: 6rpx;
		margin-bottom: 24rpx;
		padding: 38rpx 30rpx;
		display: flex;
		align-items: center;
		
		.u-cell-left{
			.u-cell-title{
				font-size: 28rpx;
				color: #383842;
				line-height: 40rpx;
				margin-bottom: 16rpx;
			}
			
			.u-cell-desc{
				color: #9C9C9C;
				font-size: 24rpx;
				
				.number{
					color: #A2C833;
				}
			}
		}
		
		.u-cell-right{
			width: 120rpx;
			margin-left: 20rpx;
			
			.btn{
				font-size: 28rpx;
				color: #fff;
				background-color: #A2C833;
				border-radius: 6rpx;
				line-height: 56rpx;
				padding: 0;
			}
			
			.disabled-btn{
				opacity: 0.4;
			}
			
			.fraction{
				font-size: 24rpx;
				color: #606366;
				text-align: center;
			}
		}
	}

</style>
